<template>
   <van-form @submit="nextHandler" validate-trigger="onChange">
      <van-cell-group inset>
         <van-field v-model="password" type="password" name="password" label="请输入密码" :rules="[
         { required: true, pattern, message: '密码必须是6-12位字符' },]" label-width="5em">
         </van-field>
      </van-cell-group>
      <div style="margin: 16px;">
         <van-button round block type="danger" native-type="submit" :disabled="disable">
            下一步
         </van-button>
      </div>
   </van-form>
</template>

<script setup lang='ts'>
import { ref, reactive, computed } from 'vue';
import { register } from '@/apis/user'
import { useUserStore } from '@/store/userStore'
import { useRouter } from 'vue-router'
import { Dialog } from 'vant'
import router from '@/router';
const user = useUserStore()
const password = ref('123456')
const pattern = /^.{6,12}$/
const disable = computed<boolean>(() => {
   return pattern.test(password.value) ? false : true
})
const nextHandler = () => {
   register(user.tel, password.value)
      .then(res => {
         if ((res as any).code === '200') {
            Dialog.alert({
               message: '注册成功，立刻去登陆？'
            }).then(() => {
               router.push('/login')
            })
         }
      })

}
</script>

<style scoped lang='scss'>
.van-form {
   padding-top: 25px;
}
</style>
